<template>
   <div class="header">
     {{ ts }}
     <div class="w">
      <div class="cheng">1</div>
      <div class="cheng count">
        <el-input  v-model="input" placeholder="请输入内容"></el-input>
       <el-button type="primary" icon="el-icon-search">搜索</el-button>
        <a class="g">高级检索</a>
      </div>
    </div>
    <div class="tarB">
      <div class="w">
        <el-menu
          class="el-menu-demo"
          mode="horizontal"
          background-color="#545c64"
          text-color="#fff" 
        >
           <router-link tag="el-menu-item"  to="/home" exact>首页</router-link>
           <router-link tag="el-menu-item"  to="/resources" >资源中心</router-link>
        </el-menu>
      </div>
    </div> 
    <slot></slot>
    <div class="w ">
      <div class="cheng">
        <span>当前位置:</span>
        <span style="color:blue">{{ location }}</span>
      </div>
    </div>
   </div>
</template>
<script>
export default {
   name:'headers',
   data() {
      return {
          input: "",
         activeIndex2:'1'
      }
   },
   props:{
     location:{
       type:String,
       default:'首页'
     },
     ts:{
       type:Number,
       default:0
     }
   }
}
</script>


<style lang='scss' scoped>
.w {
  margin-top: 10px;
  display: flex;
  justify-content: space-between;
  .cheng {
    width: 100%;
    box-sizing: border-box;
  }
  .count {
    display: flex;
    .g {
      display: inline-block;
      width: 20%;
      font-size: 12px;
      color: royalblue;
      padding: 1.5%;
      text-align: center;
    }
    
  .g:hover {
    cursor:pointer
    }
  }
}
.tarB {
 background: #545c64;
  box-sizing: border-box;
  .w {
    background: #545c64;
  .active {
    background: red !important;
    color: #fff;
  }
  }
   
}

</style>